import {
	_decorator,
	Component,
	Color,
	MeshRenderer,
	tween,
	Quat,
	Node,
	Vec3,
	find,
} from 'cc';
import { FoldCube } from './FoldCube';
import { MultipleAudioControler } from '../logicalReasoning/MultipleAudioControler';

const { ccclass, property } = _decorator;

@ccclass('FoldCubeSurface')
export class FoldCubeSurface extends Component {
	@property({ type: Color })
	surfaceColor: Color;

	//三个辅助节点
	@property({ type: Node })
	left!: Node;
	@property({ type: Node })
	middle!: Node;
	@property({ type: Node })
	right!: Node;

	player: MultipleAudioControler;

	private quat_now: Quat = new Quat();
	private quat_start: Quat = new Quat();
	private quat_rotation: Quat = new Quat();
	private tempQ4: Quat = new Quat();
	private tempV3: Vec3 = new Vec3();
	private axis: Vec3 = new Vec3();
	private defaultColor = new Color(255, 255, 255);
	private animateTime: number = 1;
	static isRotating: boolean = false; // 是否正在转动
	public _active: boolean = true; // 是否可以旋转
	foldCube!: FoldCube;

	start() {
		// this.initColor();
		this.foldCube = this.node.parent.getComponent(FoldCube);
		this.player = this.node.getComponent(MultipleAudioControler);
	}
	get active() {
		return this._active;
	}

	set active(bool: boolean) {
		this._active = bool;
	}

	initColor(color: Color = this.defaultColor) {
		let mesh = this.node.getComponent(MeshRenderer);
		let mat = mesh.materials[0];
		mat.setProperty('mainColor', color);
	}

	get canRotate(): boolean {
		if (!this.active) return false;
		return !this.node.parent.getComponent(FoldCubeSurface)?.active;
	}

	rotateFace() {
		if (FoldCubeSurface.isRotating || !this.canRotate) return;
		this.player.play('move');
		FoldCubeSurface.isRotating = true;
		this.node.getRotation(this.quat_start);
		let rad = Math.PI / 2;
		this.node.getRotation(this.quat_rotation);
		Quat.rotateX(this.quat_rotation, this.quat_rotation, rad); // 计算旋转后的 四元数

		// 获取三个辅助点的世界坐标
		let left = this.left.worldPosition.clone();
		let middle = this.middle.worldPosition.clone();
		let right = this.right.worldPosition.clone();
		let startP = this.node.worldPosition.clone();
		// 获取旋转轴
		Vec3.subtract(this.axis, right, left);

		let _this = this;
		tween(this.node)
			.to(
				_this.animateTime,
				{
					rotation: this.quat_rotation,
					// worldPosition: this.tempV3,
				},
				{
					onUpdate(target, ratio) {
						// 球面插值 否则会变形
						_this.quat_now
							.set(_this.quat_start)
							.slerp(_this.quat_rotation, ratio);
						target.setRotation(_this.quat_now);

						// 获取旋转的向量
						Vec3.subtract(_this.tempV3, startP, middle);
						// 获取旋转的四元数
						Quat.fromAxisAngle(_this.tempQ4, _this.axis, rad * ratio);
						// 得到旋转后的向量
						Vec3.transformQuat(_this.tempV3, _this.tempV3, _this.tempQ4);
						// 计算旋转后的坐标
						Vec3.add(_this.tempV3, _this.tempV3, middle);
						_this.node.setWorldPosition(_this.tempV3);
					},
					onComplete(target: Node) {
						FoldCubeSurface.isRotating = false;
						let s = target.getComponent(FoldCubeSurface);
						s.active = false;
						let cube_viewNode = find('cube_view');
						let foldCube = cube_viewNode.getComponent(FoldCube);
						foldCube.foldOneSurface();
					},
				}
			)
			.start();
	}
	update(deltaTime: number) {}
}
